<template>
    <el-menu
    background-color="#ffffff"
    active-text-color="#D9D914"
    class="el-menu-vertical-demo"
    text-color="#100f0f"
    @open="handleOpen"
    @close="handleClose"
    router
    >
      <el-menu-item index="/index.html">
        <el-icon ><House /></el-icon>
        <span>首页</span>
      </el-menu-item>
      <el-sub-menu index="2">
        <template #title>
          <el-icon><Avatar /></el-icon>
          <label>个人中心</label>
        </template>
        <el-menu-item-group>
          <el-menu-item index="/demo04" >个人信息</el-menu-item>
          <el-menu-item index="/">修改信息</el-menu-item>
        </el-menu-item-group>
      </el-sub-menu>
      <el-sub-menu index="2">
        <template #title>
          <el-icon><Menu /></el-icon>
          <label>用户管理</label>
        </template>
        <el-menu-item-group>
          <el-menu-item index="/backUl" >管理信息</el-menu-item>
          <el-menu-item index="/demo03">用户信息</el-menu-item>
        </el-menu-item-group>
      </el-sub-menu>
      <el-sub-menu index="3">
        <template #title>
          <el-icon><Operation /></el-icon>
          <span>药品管理</span>
        </template>
        <el-menu-item index="/demo02">西药信息</el-menu-item>
      </el-sub-menu>
      <el-sub-menu index="4">
        <template #title>
          <el-icon><Comment /></el-icon>
          <span>日志管理</span>
        </template>
        <el-menu-item index="/demo01">登录日志</el-menu-item>
      </el-sub-menu>
      <el-sub-menu index="5">
        <template #title>
          <el-icon><Setting /></el-icon>
          <span>系统管理</span>
        </template>
        <el-menu-item index="/demo01">系统信息</el-menu-item>
      </el-sub-menu>
    </el-menu>
</template>
<style>
.hover-effect:hover {
  background-color: #911645;
  color: #1890ff;
}
.el-menu-vertical-demo:(.el-menu--collapse) {
  width: 300px;
  min-height: 400px;
}
</style>

<script>
export default {
  data () {
    return {
      isCollapse: true
    }
  },
  methods: {
    handleOpen (key, keyPath) {
      console.log(key, keyPath)
    },
    handleClose (key, keyPath) {
      console.log(key, keyPath)
    }
  }
}
</script>
